<template>
	<view class="total">
		<image src="../../static/back.png" mode="" class="back" @click="backto()"></image>
		<image :src="avater" mode="" class="head"></image>
		<view class="uMessage">
			<view class="uname">
				{{sname}}
			</view>
			<view class="ulocation">
				{{address}}
			</view>
		</view>
		<image src="../../static/more.png" mode="" class="more"></image>
	</view>
</template>

<script>
	export default {
		name:"tribeNavigation",
		props:{
			sname:"",
			avater:String,
			address:String
		},
		data() {
			return {
				
			};
		},
		created() {
			console.log(this.details)
		},
		methods:{
			backto(){
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss">
.total {
	width: 100%;
	height: 170rpx;
	background-color: #f2f2f2;
	position: relative;
	.back {
		width: 45rpx;
		height: 40rpx;
		margin-left: 20rpx;
		margin-right: 20rpx;
		position: relative;
		top: 50rpx;
		display: inline-block;
	}
	.head {
		width: 80rpx;
		height: 80rpx;
		background-color: white;
		border-radius: 40rpx;
		position: relative;
		top: 70rpx;
		margin-right: 20rpx;
	}
	.uMessage {
		height: 80rpx;
		display: inline-block;
		position: relative;
		top: 60rpx;
		
		.uname {
			height: 40rpx;
			font-weight: bold;
			color: dimgray;
			font-size: 35rpx
		}
		.ulocation {
			margin-top: 10rpx;
			height: 30rpx;
			font-weight: bold;
			font-size: 25rpx;
			color: dimgrey;
		}
	}
	.more {
		width: 80rpx;
		height: 80rpx;
		float: right;
		margin-right: 30rpx;
		margin-top: 70rpx;
	}
}
</style>